<template>
	<div class="body">
		<!-- <div class="header">
			<div>
				<img @click="returnGo" src="../../assets/homeimg/滑动左.png" />
				<span>关于我们</span>
			</div>
		</div> -->
		<div class="min">
			<p class="title">{{obj.title}}</p>
			<div class="content" v-html="obj.content">{{obj.content}}</div>
		</div>
	</div>
</template>

<script>
	import mineApi from "@/api/mine";
	// import Header from "@/components/header";
	export default {
		data() {
			return {
				obj: {}
			};
		},
		components: {},
		created() {
			this.getabout();
		},
		methods: {
			returnGo() {
				this.$router.go(-1);
			},
			getabout() {
				mineApi.about().then(res => {
					console.log(res)
					this.obj = res.data;
				})
			}
		}
	};
</script>

<style scoped lang="scss">
	.body {
		color: #333333;
		height: 100%;
		display: flex;
		flex-direction: column;
		min-height: 100vh;
	}

	.header {
		// font-weight: bold;
		width: 100%;
		text-align: center;
		height: 2.75rem;
		line-height: 2.75rem;
		padding-top: 1.25rem;
		position: relative;
		border-bottom: 1px solid #dcdcdc;
		color: #333333;
		font-size: 1.25rem;

		img {
			width: 0.625rem;
			height: 1.125rem;
			position: absolute;
			left: 1rem;
			bottom: 0.75rem;
		}
	}

	// 在scss文件中
	@supports(bottom:constant(safe-area-inset-top)) {

		// 如果存在底部安全区域
		.header {
			padding-top: constant(safe-area-inset-top);

		}

	}

	@supports(bottom:env(safe-area-inset-top)) {

		// 如果存在底部安全区域
		.header {
			padding-top: env(safe-area-inset-top);

		}

	}

	.min {
		flex: 1;
		height: 18.75rem;
		width: 21.5625rem;
		margin: 0 auto;
		// background: #fff;

		.content {
			width: 100%;
			line-height: 20px;

			// height: 18.75rem;
			/deep/ p {
				width: 100%;

				// height: 6.25rem;
				img {
					height: 12.5rem;
				}
			}
		}

		.title {
			padding-top: .625rem;
			padding-bottom: .625rem;
			text-align: center;
		}
	}
</style>
